<template>
	<view class="noteview" @click="naviToDetail">
<image :src="pictures[0].pictureurl" mode="aspectFill" class="codefun-self-start image_2"></image>
		<text class="codefun-self-start font_1 text_2">{{note.notetitle}}</text>
		<view class="codefun-flex-row codefun-justify-between">
			<view class="num">
				<image class="image_love" src="../../static/love.png" />
				<text>{{favornum}}</text>
				<image class="image_love image_collect" src="../../static/store.png" />
				<text>{{starnum}}</text>
			</view>


		</view>

	</view>
</template>

<script>
	export default {
		name: "noteview",
		props: {
			noteid: {
				type: Number,
				default: 0
			}
		},
		data() {

			return {
				// picture: "../../static/love.png",
				noteTitle: "笔记",
				note: '',
				//默认路径避免报错
				pictures: [{}],
				favornum: 123,
				starnum: 456
			}
		},
		mounted() {
			console.log("noteview"+this.noteid)
			this.getCommunityNote(this.noteid);
			this.getStarNum(this.noteid);
			this.getFavorNum(this.noteid);
			this.getPictureByNoteId(this.noteid);
			console.log("加载社区笔记" + this.noteid)

		},
		methods: {
			naviToDetail() {
				let that=this
				uni.navigateTo({
					url: "../../pages/notedetail2/notedetail2?noteID="+that.noteid
				})
			},
			getPictureByNoteId(noteid) {
				let that=this
				uni.request({
					url: '/note/getPictureByNoteId/' + that.noteid,

					method: 'GET',
					header: {
						'content-type': 'application/json'
					},
					success: (res) => {
						if (res.statusCode === 200) {
							console.log("noteviewpicture"+res.data)
							that.pictures = res.data;
						}
					},
					fail: (err) => {
						console.error(err);
					}
				});
			},

			getFavorNum(noteid) {
				let that=this
				//参数为noteid
				uni.request({
					url: '/favor/favorNum/' + that.noteid,
					method: 'GET',
					header: {
						'content-type': 'application/json'
					},
					success: (res) => {
						if (res.statusCode === 200) {
							that.favornum = res.data;
						}
					},
					fail: (err) => {
						console.error(err);
					}
				});
			},
			getStarNum(noteid) {
				let that=this
				// 参数为noteid
				uni.request({
					url: '/star/starList/starNum/' + that.noteid,
					method: 'GET',
					header: {
						'content-type': 'application/json'
					},
					success: (res) => {
						if (res.statusCode === 200) {
							that.starnum = res.data;
						}
					},
					fail: (err) => {
						console.error(err);
					}
				});
			},

				getCommunityNote(noteid){
					let that=this
				uni.request({
					url: '/community/getCommunityNote/' + that.noteid,

					method: 'GET',
					header: {
						'content-type': 'application/json'
					},
					success: (res) => {
						if (res.statusCode === 200) {
							that.note = res.data;
						}
					},
					fail: (err) => {
						console.error(err);
					}
				});
			},
		},
		}
	
</script>

<style lang="scss">
	.noteview {
		padding: 34.88rpx 6.98rpx 13.95rpx 24.42rpx;
		height: 370rpx;
		background-color: #ffffff;
		border-radius: 13.95rpx;
		border: solid 8.72rpx #6073eb;
		display: inline-block;
	}

	.image_2 {
		margin-left: 3.49rpx;
		width: 214.53rpx;
		height: 205.81rpx;
	}

	.image_love {
		width: 27.91rpx;
		height: 27.91rpx;
	}

	.image_collect {
		// margin-right: 76.74rpx;
	}

	.font_1 {
		font-size: 41.86rpx;
		font-family: AlimamaShuHeiTi;
		line-height: 33.14rpx;
		color: #1c167d;
	}

	.text_2 {
		// display: inline-block;
		// white-space: nowrap;
		// overflow: hidden;
		// text-overflow: ellipsis;
		// max-width: 10ch;
		margin-left: 3.49rpx;
		// overflow: hidden;
		// word-break: break-all;
		// /* break-all(允许在单词内换行。) */
		// text-overflow: ellipsis;
		// /* 超出部分省略号 */
		// display: -webkit-box;
		// /** 对象作为伸缩盒子模型显示 **/
		// -webkit-box-orient: vertical;
		// /** 设置或检索伸缩盒对象的子元素的排列方式 **/
		// -webkit-line-clamp: 1;
		// /** 显示的行数 **/
	}

	.num {
		margin-top: 10px;
	}
</style>